<!DOCTYPE html>
<html>
<head lang="en">
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <link rel="stylesheet" type="text/css" href="./stylesheets/base.css">
    <link rel="stylesheet" type="text/css" href="./stylesheets/yuyue.css">
    <style>
        body{
            background-color: tan;
        }
        .chart {
            width: 90%;
            height: 750px;
            margin: 10px auto;
        }
    </style>
</head>

<body>
<div class="chart" id="chart"></div>
<script src="js/jquery-1.8.3.min.js"></script>
<script src="js/common.js"></script>
<script src="plugins/echarts/dist/echarts-all.js"></script>
<script>
    var _toolbox={
        show:true,
        feature:{
            saveAsImage:{show:true}
        }
    };
    !function initMap(){
        taskMap = echarts.init(document.getElementById("chart"));
        echarts.util.mapData.params.params["zq_map"] = {
            getGeoJson: function (callback) {
                $.getJSON('./data/geo.json', callback);
            }
        };
        //挂载事件库
        var option = {};
        $.ajax({
            url:"./data/map.json",
            dataType:"json"
        }).done(function(data){
            var i = 0,ms = data.resultDatas.seriesData.map1Data;
            //$.getJSON('./data/zongbu_geo.json', {}, function (geo) {
                option = {
                    backgroundColor:"#fff",
                    title: {
                        show: false,
                        text: data.resultDatas.chartTitle,
                        subtext: data.resultDatas.chartSubTitle
                    },
                    toolbox: _toolbox,
                    legend: {
                        orient: 'vertical',
                        x: 'left',
                        data: [],
                        showLegendSymbol: true
                    },
                    dataRange: {
                        show: false,
                        min: 70,
                        max: 150,
                        color: ["green", "#CC9966"]
                    },
                    series: [{
                        name: '战区地图',
                        type: 'map',
                        mapType: 'zq_map',
                        selectedMode: 'single',
                        itemStyle: {
                            normal: {
                                borderColor:'#fff',
                                borderWidth:1,
                                label: {
                                    show: true,
                                    textStyle: {
                                        color: "#000"
                                    }
                                }
                            },
                            emphasis: {
                                borderWidth:3,
                                borderColor:'#456A0E',
                                label: {
                                    show: true,
                                    textStyle: {
                                        color: "#fff"
                                    }
                                }
                            }
                        },
                        data: ms
                    }]
                };
                taskMap.setOption(option);
          //  })
        });
    }()
</script>
</body>

</html>
